<!DOCTYPE html>
<html>

<head>
    <title>Module Develop</title>
    <meta charset="utf-8">
    <meta name="viewport"
        content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <style type="text/css">
        html,
        body {
            height: 100%
        }

        body {
            background-color: #fff;
            margin: 0;
        }

        #wrap {
            height: 100%;
            position: relative;
        }

        #main {
            display: block;
        }

        a.button {
            display: -webkit-box;
            -webkit-box-pack: center;
            -webkit-box-align: center;
            height: 36px;
            margin: 8px;
            background-color: rgba(240, 240, 240, 1.0);
            border-color: rgba(220, 220, 220, 1.0);
            border-width: 2px;
            border-style: solid;
        }

        a.active {
            background-color: rgba(240, 240, 240, 0.6);
        }
    </style>
</head>

<body>
    <div id="wrap">
        <header id="header">

        </header>
        <div id="main">
            <a class="button" tapmode="active" onclick="initLBCast()">初始化</a>
            <a class="button" tapmode="active" onclick="DeviceList()">搜索设备</a>
            <a class="button" tapmode="active" onclick="stopSearch()">停止搜索</a>
            <a class="button" tapmode="active" onclick="DoSet(3)">pin码获取设备信息</a>
            <a class="button" tapmode="active" onclick="scanQrCode()">二维码获取设备信息</a>
            <a class="button" tapmode="active" onclick="connectDevice()">链接设备</a>
            <a class="button" tapmode="active" onclick="stopConnect()">断开链接</a>
            <a class="button" tapmode="active" onclick="castStartVideo()">在线视频</a>
            <a class="button" tapmode="active" onclick="castStartVideoList(0)">在线视频1</a>
            <a class="button" tapmode="active" onclick="castStartVideoList(1)">在线视频2</a>
            <a class="button" tapmode="active" onclick="castStartVideoList(2)">在线视频3</a>
            <a class="button" tapmode="active" onclick="castStartAudio()">在线音频</a>
            <a class="button" tapmode="active" onclick="castStartPicture()">在线图片</a>
            <a class="button" tapmode="active" onclick="castStartLocalVideo()">本地视频</a>
            <a class="button" tapmode="active" onclick="castStartLocalPicture()">本地图片</a>
            <a class="button" tapmode="active" onclick="castStop()">退出投屏</a>
            <a class="button" tapmode="active" onclick="progressInfo()">播放信息(视频、音乐)</a>
            <a class="button" tapmode="active" onclick="addVolume()">加音量</a>
            <a class="button" tapmode="active" onclick="reduceVolume()">减音量</a>
            <a class="button" tapmode="active" onclick="DoSet(0)">设置音量</a>
            <a class="button" tapmode="active" onclick="DoSet(1)">设置进度</a>
            <a class="button" tapmode="active" onclick="pauseOrResume()">暂停或继续</a>
            <a class="button" tapmode="active" onclick="pause()">暂停</a>
            <a class="button" tapmode="active" onclick="resume()">继续</a>
            <a class="button" tapmode="active" onclick="startMirror()">开始镜像</a>
            <a class="button" tapmode="active" onclick="stopMirror()">结束镜像</a>
            <p style="padding: 0 15px;line-height: 30px;">由于sdk升级1.0.3版本之后安卓将不支持弹幕功能</p>
            <a class="button" tapmode="active" onclick="canBarrage()">是否支持弹幕功能</a>
            <a class="button" tapmode="active" onclick="canPushBarrageNow()">现在是否可以发送弹幕</a>
            <a class="button" tapmode="active" onclick="DoSet(2)">发送弹幕</a>
        </div>
    </div>
</body>
<script src="../../script/api.js"></script>
<script>
    var lBCast, UIAlbumBrowser, str_name, str_ip, FNScanner;
    function apiready() {
        UIAlbumBrowser = api.require('UIAlbumBrowser');
        lBCast = api.require('lBCast');
        FNScanner = api.require('FNScanner');
        var header = document.getElementById('header');
        header.style.paddingTop = api.safeArea.top + 'px';

        //搜索设备
        api.addEventListener({
            name: 'searchDevice'
        }, function (ret, err) {
            SearchDevice();
        });

        //链接设备
        api.addEventListener({
            name: 'connectDevice'
        }, function (ret, err) {
            str_ip = ret.value.ip;
            str_name = ret.value.name;
            connectDevice();
        });

    }

    //初始化模块
    function initLBCast() {
        lBCast.initLBCast(function (ret, err) {
            console.log(JSON.stringify(ret));
            console.log(JSON.stringify(err));
            if (ret.status) {
                alert(ret.msg);
            } else {
                alert(ret.msg);
            }
        });
    }

    //设备列表
    function DeviceList() {
        api.openFrame({
            name: 'deviceList_frm',
            url: 'widget://html/LBCast/deviceList_frm.html',
            bounces: false,
            rect: {
                x: 0,
                y: 0,
                w: api.winWidth,
                h: api.winHeight
            },
            animation: {
                type: "push",                //动画类型（详见动画类型常量）
                subType: "from_bottom",       //动画子类型（详见动画子类型常量）
                duration: 300                //动画过渡时间，默认300毫秒
            }

        });
    }

    //搜索设备
    function SearchDevice() {
        lBCast.searchDevice(function (ret, err) {
            console.log(JSON.stringify(ret));
            if (ret.result === 0) {
                //搜索投屏设备成功
                api.sendEvent({
                    name: 'searchDeviceResult',
                    extra: { list: ret.list }
                });
            } else {
                alert(ret.msg);
            }
        });
    }

    //链接设备
    function connectDevice() {
        lBCast.connectDevice({
            name: str_name,
            ip: str_ip
        }, function (ret, err) {
            console.log(JSON.stringify(ret));
            if (ret.status === 0) {
                api.toast({
                    msg: '设备链接成功',
                    duration: 2000,
                    location: 'bottom'
                });
                //关闭设备列表
                api.closeFrame({
                    name: 'deviceList_frm'
                });
            } else {
                console.log(ret.msg);
            }
        });
    }

    //停止搜索
    function stopSearch() {
        lBCast.stopSearch(function (ret, err) {
            alert(ret.msg);
        });
    }

    //停止链接
    function stopConnect() {
        lBCast.stopConnect(function (ret, err) {
            alert(ret.msg);
        });
    }

    //开始投屏/视频
    function castStartVideo() {
        lBCast.castStart({
            url: 'http://hpplay.cdn.cibn.cc/videos/01.mp4',
            mediaType: 0,
            startPosition: 2
        }, function (ret, err) {
            console.log(JSON.stringify(ret));

        });
    }

    function castStartVideoList(_index) {
        var videosList=[
                    "https://v.mifile.cn/b2c-mimall-media/ed921294fb62caf889d40502f5b38147.mp4",
                    "http://hpplay.cdn.cibn.cc/videos/02.mp4",
                    "http://hpplay.cdn.cibn.cc/videos/03.mp4"
                    ];
        lBCast.castStart({
            url: videosList[_index],
            mediaType: 0,
            startPosition: 2
        }, function (ret, err) {
            console.log(JSON.stringify(ret));

        });
    }

    //开始投屏/音频
    function castStartAudio() {
        lBCast.castStart({
            url: 'http://jiancang.postpost.cc/yuwowuguan.mp3',
            mediaType: 4,
            startPosition: 45
        }, function (ret, err) {
            console.log(JSON.stringify(ret));

        });
    }

    //开始投屏/图片
    function castStartPicture() {
        lBCast.castStart({
            url: 'http://news.cri.cn/gb/mmsource/images/2013/06/23/2/2211679758122940818.jpg',
            mediaType: 2,
            startPosition: 45
        }, function (ret, err) {
            console.log(JSON.stringify(ret));

        });
    }

    //本地视频
    function castStartLocalVideo() {

        UIAlbumBrowser.open({
            max: 1,
            type: 'video',
            styles: {
                bg: '#fff',
                mark: {
                    icon: '',
                    position: 'bottom_left',
                    size: 20
                },
                nav: {
                    bg: 'rgba(0,0,0,0.6)',
                    titleColor: '#fff',
                    titleSize: 18,
                    cancelColor: '#fff',
                    cancelSize: 16,
                    finishColor: '#fff',
                    finishSize: 16
                }
            },
            rotation: false
        }, function (ret) {
            if (ret) {
                console.log(JSON.stringify(ret));
                if (ret.eventType === 'confirm') {
                    var imgUrl = ret.list[0].path;

                    UIAlbumBrowser.transPath({
                        path: imgUrl
                    }, function (ret, err) {
                        if (ret) {
                            console.log(ret.path);
                            _castStartLocalVideo(ret.path);
                        } else {
                            alert(JSON.stringify(err));
                        }
                    });

                }
            }
        });

    }

    function _castStartLocalVideo(_path) {
        lBCast.castStart({
            url: _path,
            mediaType: 1,
            startPosition: 0
        }, function (ret, err) {
            console.log(JSON.stringify(ret));
        });
    }

    //投屏本地图片
    function castStartLocalPicture() {
        UIAlbumBrowser.open({
            max: 1,
            type: 'image',
            styles: {
                bg: '#fff',
                mark: {
                    icon: '',
                    position: 'bottom_left',
                    size: 20
                },
                nav: {
                    bg: 'rgba(0,0,0,0.6)',
                    titleColor: '#fff',
                    titleSize: 18,
                    cancelColor: '#fff',
                    cancelSize: 16,
                    finishColor: '#fff',
                    finishSize: 16
                }
            },
            rotation: false
        }, function (ret) {
            if (ret) {
                console.log(JSON.stringify(ret));
                if (ret.eventType === 'confirm') {
                    var imgUrl = ret.list[0].path;
                    UIAlbumBrowser.transPath({
                        path: imgUrl
                    }, function (ret, err) {
                        if (ret) {
                            console.log(ret.path);
                            _castStartLocalPicture(ret.path);
                        } else {
                            alert(JSON.stringify(err));
                        }
                    });
                }
            }
        });

    }

    function _castStartLocalPicture(_path) {
        lBCast.castStart({
            url: _path,
            mediaType: 3,
            startPosition: 45
        }, function (ret, err) {
            console.log(JSON.stringify(ret));
        });
    }

    //退出投屏
    function castStop() {
        lBCast.castStop(function (ret, err) {
            if (ret.result) {
                alert('成功');
            } else {
                alert(ret.msg);
            }
        });
    }

    //播放信息
        function progressInfo() {
        lBCast.progressInfo(function (ret, err) {
            console.log('播放信息'+JSON.stringify(ret));
            api.sendEvent({
                name: 'playInfo',
                extra: ret
            });
        });

        //打开播放信息界面
        api.openFrame({
            name: 'playInfo_frm',
            url: 'widget://html/LBCast/playInfo_frm.html',
            bounces: false,
            rect: {
                x: 0,
                y: 0,
                w: api.winWidth,
                h: api.winHeight
            },
            animation: {
                type: "push",                //动画类型（详见动画类型常量）
                subType: "from_bottom",       //动画子类型（详见动画子类型常量）
                duration: 300                //动画过渡时间，默认300毫秒
            }

        });
    }

    //加音量
    function addVolume() {
        lBCast.addVolume(function (ret, err) {
            console.log(JSON.stringify(ret));
            if (ret.result) {

            } else {
                alert(ret.msg);
            }
        });
    }

    //减音量
    function reduceVolume() {
        lBCast.reduceVolume(function (ret, err) {
            console.log(JSON.stringify(ret));
            if (ret.result) {

            } else {
                alert(ret.msg);
            }
        });
    }

    //设置
    function DoSet(_type) {
        api.prompt({
            buttons: ['确定', '取消'],
            title: '请输入',
            text: ''
        }, function (ret, err) {
            var text = ret.text;
            if (ret.buttonIndex == 1) {
                if (text) {

                    switch (_type) {
                        case 0:
                            setVolume(text);
                            break;
                        case 1:
                            setSeekTo(text);
                            break;
                        case 2:
                            pushBarrage(text);
                            break;
                        case 3:
                            pinCodeDevice(text);
                            break;
                    }
                } else {
                    api.toast({
                        msg: '不能为空',
                        duration: 2000,
                        location: 'bottom'
                    });
                }
            }
        });
    }

    //设置音量
    function setVolume(_volume) {
        lBCast.setVolume({
            volume: _volume
        }, function (ret, err) {
            if (ret.status) {
                console.log('成功');
            } else {
                alert(ret.msg);
            }
        });
    }

    //设置进度
    function setSeekTo(_seekTime) {
        lBCast.setSeekTo({
            seekTime: _seekTime
        }, function (ret, err) {
            if (ret.result) {
                alert(JSON.stringify(ret));
            } else {
                alert(ret.msg);
            }
        });
    }

    //暂停或继续
    function pauseOrResume() {
        lBCast.pauseOrResume(function (ret, err) {
            if (ret.result) {
                console.log(JSON.stringify(ret));
            } else {
                alert(ret.msg);
            }
        });
    }

    //暂停
    function pause() {
        lBCast.pause(function (ret, err) {
            if (ret.result) {
                console.log(JSON.stringify(ret));
            } else {
                alert(ret.msg);
            }
        });
    }

    //继续
    function resume() {
        lBCast.resume(function (ret, err) {
            if (ret.result) {
                console.log(JSON.stringify(ret));
            } else {
                alert(ret.msg);
            }
        });
    }

    //是否支持弹幕功能
    function canBarrage() {
        lBCast.canBarrage(function (ret, err) {
            console.log(JSON.stringify(ret));
            if (ret.result) {
                alert(JSON.stringify(ret));
            } else {
                alert(ret.msg);
            }
        });
    }

    //现在是否可以发送弹幕
    function canPushBarrageNow() {
        lBCast.canPushBarrageNow(function (ret, err) {
            if (ret.result) {
                alert(JSON.stringify(ret));
            } else {
                alert(ret.msg);
            }
        });
    }

    //发送弹幕
    function pushBarrage(_text) {
        lBCast.pushBarrage({
            text: _text,
            textColor: '#333',
            textSize: 18
        }, function (ret, err) {
            if (ret.result) {
                console.log(JSON.stringify(ret));
            } else {
                alert(ret.msg);
            }
        });
    }

    //开始镜像
    function startMirror() {
        lBCast.startMirror({
            resolutionLevel: 0,
            bitrateLevel: 0,
            audioEnable: true
        }, function (ret, err) {
            console.log('开始镜像' + JSON.stringify(ret));
            if (ret.result) {
                console.log(JSON.stringify(ret));
            } else {
                alert(ret.msg);
            }
        });
    }

    //结束镜像
    function stopMirror() {
        lBCast.stopMirror({
        }, function (ret, err) {
            console.log('结束镜像' + JSON.stringify(ret));

            if (ret.result) {
                console.log(JSON.stringify(ret));
            } else {
                alert(ret.msg);
            }
        });
    }

    //pin码
    function pinCodeDevice(_pinCode) {
        lBCast.pinCodeDevice({
            pinCode: _pinCode
        }, function (ret, err) {
            if (ret.result) {
                alert(JSON.stringify(ret));
                str_ip = ret.device.ip;
                str_name = ret.device.name;
                alert("下一步，点击链接设备");
            } else {
                alert(ret.msg);
            }
        });
    }

    //扫码
    function qrCodeDevice(_qrUrl) {
        lBCast.qrCodeDevice({
            qrUrl: _qrUrl
        }, function (ret, err) {
            if (ret.result) {
                alert(JSON.stringify(ret));
                str_ip = ret.device.ip;
                str_name = ret.device.name;
                alert("下一步，点击链接设备");
            } else {
                alert(ret.msg);
            }
        });
    }

    function scanQrCode() {
        FNScanner.open({
            autorotation: true
        }, function (ret, err) {
            if (ret) {
                console.log(JSON.stringify(ret));
                if (ret.eventType === 'success') {
                    var txt = ret.content;
                    qrCodeDevice(txt);
                }
            } else {
                alert(JSON.stringify(err));
            }
        });
    }
</script>

</html>